<template>
	<view class="cu-modal" :class="props.modalName == props.tag ? 'show' : ''">
		<view class="cu-dialog">
			<view class="cu-bar bg-white padding-left text-black">
				分配司机任务
			</view>
			<view class="padding-left padding-right bg-white">
				<form>
					<view class="cu-form-group margin-top-xs">
						<view class="title">运输车辆</view>
						<picker @change="PickerChange" :value="index" :range="picker">
							<view class="picker">
								{{index>-1?picker[index]:driver}}
							</view>
						</picker>
					</view>
					<view class="cu-form-group">
						<view class="title">运输重量</view>
						<input v-model="weight" placeholder="请输入运输重量" name="input" />
					</view>
				</form>
			</view>
			<view class="cu-bar bg-white justify-end margin-top-xs">
				<view class="action">
					<button class="cu-btn line-green text-green" @tap="hideModal">取消</button>
					<button class="cu-btn bg-green margin-left" @tap="commitModal">确定</button>
				</view>
			</view>
		</view>
	</view>
</template>

<script setup lang="ts">
	import {
		useSettingStore
	} from '@/stores/index';
	import {
		ref,
		watch
	} from 'vue';
	import {
		onShow
	} from '@dcloudio/uni-app';
	const setting = useSettingStore();
	const emit = defineEmits(['action']);
	const props = defineProps({
		modalName: {
			type: String,
			default: ''
		},
		tag: {
			type: String,
			default: 'AuthorizationModal'
		},
		info: {
			type: Object,
			default: {
				id: 0,
				weight: 0,
				name: ''
			}
		}
	});
	const picker = ref(['川A12315', '川B12315', '川C12315'])
	const pickerList: any = ref([])
	const index = ref(-1)
	const weight = ref(0)
	const driver = ref('')
	watch(() => props.modalName, (newValue, oldValue) => {
		if (newValue.length > 0) {
			onDriverList()
		}
	});
	watch(() => props.info, (newValue: any, oldValue) => {
		weight.value = newValue.weight
		driver.value = newValue.name
	});

	const PickerChange = (e: any) => {
		index.value = e.detail.value
	}
	const hideModal = () => {
		emit('action', props.info);
	};
	const commitModal = () => {
		if (index.value > -1) {
			let info = pickerList.value[index.value]
			emit('action', {
				id: info.value,
				weight: weight.value,
				name: info.rightLabel
			});
		} else {
			emit('action', {
				id: props.info.value,
				weight: weight.value,
				name: props.info.rightLabel
			});
		}

	};
	const onDriverList = async () => {
		weight.value = 0

	}
	onShow((option: any) => {

	});
</script>

<style>
	.swiper-item {
		height: 100%;
	}
</style>
